<template>
  <div class="sort commodity-content-title flex-start">
<!--    <h2 class="checked" style="cursor: pointer; user-select: none;">综合 </h2>-->
<!--    <ul class="flex-start">-->
<!--      <li class="flex-start"><span class="">销售量</span>-->
<!--        <div class="flex-start">-->
<!--          <div class="sort-icon sort-icon-up"><i class="el-icon-caret-top"></i></div>-->
<!--          <div class="sort-icon sort-icon-down"><i class="el-icon-caret-bottom"></i></div>-->
<!--        </div>-->
<!--      </li>-->
<!--      <li class="flex-start"><span class="">价格</span>-->
<!--        <div class="flex-start">-->
<!--          <div class="sort-icon sort-icon-up"><i class="el-icon-caret-top"></i></div>-->
<!--          <div class="sort-icon sort-icon-down"><i class="el-icon-caret-bottom"></i></div>-->
<!--        </div>-->
<!--      </li>-->
<!--      <li class="flex-start"><span class="">上新</span>-->
<!--        <div class="flex-start">-->
<!--          <div class="sort-icon sort-icon-up"><i class="el-icon-caret-top"></i></div>-->
<!--          <div class="sort-icon sort-icon-down"><i class="el-icon-caret-bottom"></i></div>-->
<!--        </div>-->
<!--      </li>-->
<!--    </ul>-->
  </div>
</template>
<script setup>
</script>
<style scoped>
.commodity-content-title {
  color: var(--color-black);
  padding: 22px 28px 0px;
  user-select: none;
  position: relative;
}
.commodity-content-title h2 {
  font-weight: 500;
  font-size: 14px;
  color: var(--color-black);
  margin-right: 43px;
}
.commodity-content-title .checked {
  color: red;
}
.commodity-content-title ul {
  margin-left: 0px;
}
.commodity-content-title li {
  margin-right: 46px;
  cursor: pointer;
}
.commodity-content-title li > div {
  flex-direction: column;
}
.commodity-content-title li span {
  font-weight: 500;
  font-size: 14px;
  margin-right: 5px;
}
.commodity-content-title .el-icon-caret-bottom, .commodity-content-title .el-icon-caret-top {
  font-size: 14px;
}

.commodity-content-title .sort-icon {
  height: 10px;
  position: relative;
  width: 14px;
}

.commodity-content-title .sort-icon i {
  color: rgb(217, 217, 217);
  position: absolute;
}

.commodity-content-title .sort-icon .sort-active {
  color: var(--color-main);
}

.commodity-content-title .sort-icon-up i {
  //bottom: 4px;
}

.commodity-content-title .sort-icon-down i {
  top: -4px;
}

</style>